<extend name="Base/common" />
<block name="body">
    <div class="live-slide-offset">
        <div class="wrapper-response">
            <div class="game-sub-list-page clear padd-tb10 ">
                <ul class="v-align fs-28 bor-bott float-ul match-item clear">
                    <li><a href="{:U('index')}">赛事</a></li>
                    <li><a href="{:U('hot')}">热门</a></li>
                    <li class="active"><a href="#">预告</a></li>
                </ul>
                 <!-- hot race start-->
                 <notempty name="data">
                     <volist name="data" id="lists">
                        <div class="match-title padd-t10 padd-b20 relative match-title-color"><span class="btn btn-gray active">{$lists.date}</span></div>
                        <ul class="item-list  float-ul  match-item-lists">
                            <volist name="lists.list" id="race">
                                <li>
                                    <div class="match-cover break-cover blue-shadow">
                                        <div class="match-descr">
                                            <h3 class="v-align">
                                                <i class="icon martch-icon">
                                                    <img src="{$race.game.logo}" alt="{$race.game.name}">
                                                </i>
                                                <span>{$race.match.title}-{$race.title}</span>
                                                <span class="race-hour fr padd-lr5">{$race.race_hour}</span>
                                            </h3>
                                        </div>
                                        <div class="padd-tb10 clear">
                                            <div class="corps-name fl">
                                                <div class="teem-cover format-cover">
                                                    <img class="lazy-img" data-src="{$race.team.0.logo}" alt="{$race.team.0.name}">
                                                </div>
                                                <p class="btn btn-primary">{$race.team.0.name}</p>
                                            </div>
                                            <div class="corps-auto fl">
                                                  <div class="corps-middle">
                                                        <span class="match-circle relative">
                                                        <div class="match-trailer <eq name='race.is_scribe' value='1'>gray</eq>">
                                                            <div class="match-mask">
                                                                    <eq name="race.is_scribe" value="1" >
                                                                        <span class="match-subscribe js-subscribe subscribe-content-{$race.id} active"  data-id="{$race.id}">
                                                                           取消订阅
                                                                       </span>
                                                                    <else/>
                                                                        <span class="match-subscribe js-subscribe subscribe-content-{$race.id}" data-id="{$race.id}" >
                                                                            订阅比赛
                                                                         </span>
                                                                    </eq>
                                                              </span>
                                                             </div>
                                                        </div>
                                                        </span>
                                                    </div>
                                            </div>
                                            <div class="corps-name fl">
                                                <div class="teem-cover format-cover">
                                                     <img class="lazy-img" data-src="{$race.team.1.logo}" alt="{$race.team.1.name}">
                                                </div>
                                                <p class="btn btn-primary">{$race.team.1.name}</p>
                                            </div>
                                        </div>
                                        <notempty name="race.list">
                                            <div class="match-video-item clear relative">
                                                <i class="icon-video fl"></i>
                                                <ul class="float-ul">
                                                    <volist name="race.list" id="video">
                                                        <li>
                                                            <a href="{:U('detail?race_id='.$video['id'])}" alt="{$video['video_id']}">{$video.round}</a>
                                                            <div class="match-trangle"></div>
                                                        </li>
                                                    </volist>
                                                </ul>
                                                <div class="match-details-box">
                                                    <volist name="race.list" id="vdtitle">
                                                        <div class="match-video-details" >
                                                            <p>{$vdtitle.title}</p>
                                                        </div>
                                                    </volist>
                                                </div>
                                            </div>
                                        </notempty>
                                    </div>
                                </li>
                            </volist>
                        </ul>
                    </volist>
                </notempty>
                <!-- hot race end-->
            </div>
        </div>
    </div>
</block>